<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%
    String path = request.getContextPath();
%>    

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>  
	<meta charset="utf-8" />
	<title>banner管理－修改banner</title>
	<meta name="description" content="app, web app, responsive, admin dashboard, admin, flat, flat ui, ui kit, off screen nav" />
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" /> 
 
 	<jsp:include page="../lbi/common.jsp"></jsp:include>
 
</head>
<body class="">
  <section class="vbox">
    
		<jsp:include page="../lbi/head.jsp" ></jsp:include>
		
    <section>
      <section class="hbox stretch">
        <!-- .aside -->
            <jsp:include page="../lbi/left.jsp" ></jsp:include>
        <!-- /.aside -->
        <section id="content">
                  <section class="hbox stretch">
                          <section>
                         <section class="hbox stretch">
            <!--从这里开始复制粘贴-->
            <form method="post" action="<%=path %>/web/toUpdateBannerId.do" enctype="multipart/form-data">
	            <input type="hidden" name="id" value="${bannerEntity.id }">
	            
            <section class="vbox">
                <section class="scrollable wrapper w-f">
                
                    <section class="panel panel-default">
                        <div class="row">
                           <div class="col-xs-2 inform_left">
                                                                                            名称：
                           </div>
                           <div class="col-xs-4 inform_right">
                               <input style="width:320px;" type="text" name="name" value="${bannerEntity.name }" />
                           </div>
                        </div>
                        <div class="row">
                                <div class="col-xs-2 inform_left">
                                                                                                     位置：
                                </div>
                                <div class="col-xs-4 inform_right">
                                    <div class="form-group no3" style="margin-bottom: 0px;">
                                  <select name="position" class="form-control" style="width:30%;" id="province7">
                                    
                                    <c:if test="${bannerEntity.position == 1 }">
                                        <option value="1" selected="selected">秘书</option>
                                        <option value="2">boss</option>
                                        <option value="3">商家</option>
                                        <option value="4">排行榜</option>
                                    </c:if>
                                    
                                    <c:if test="${bannerEntity.position == 2 }">
                                        <option value="1">秘书</option>
                                        <option value="2" selected="selected">boss</option>
                                        <option value="3">商家</option>
                                        <option value="4">排行榜</option>
                                    </c:if>
                                    
                                    <c:if test="${bannerEntity.position == 3 }">
                                        <option value="1">秘书</option>
                                        <option value="2">boss</option>
                                        <option value="3" selected="selected">商家</option>
                                        <option value="4">排行榜</option>
                                    </c:if>
                                    
                                    <c:if test="${bannerEntity.position == 4 }">
                                        <option value="1">秘书</option>
                                        <option value="2">boss</option>
                                        <option value="3">商家</option>
                                        <option value="4" selected="selected">排行榜</option>
                                    </c:if>
                                    
                                  </select>
                                </div>
                                </div>
                        </div>
                        <div class="row">
                                <div class="col-xs-2 inform_left">
                                    类型：
                                </div>
                                <div class="col-xs-4 inform_right">
                                    <div class="form-group no3" style="margin-bottom: 0px;">
                                  <select name="type" class="form-control" style="width:30%;">
                                    <c:if test="${bannerEntity.type == 1 }">
                                        <option value="1" selected="selected">网页</option>
                                        <option value="2">商家</option>
                                        <option value="3">会员认证</option>
                                        <option value="4">仅供查看</option>
                                    </c:if>
                                    
                                    <c:if test="${bannerEntity.type == 2 }">
                                        <option value="1">网页</option>
                                        <option value="2" selected="selected">boss</option>
                                        <option value="3">会员认证</option>
                                        <option value="4">仅供查看</option>
                                    </c:if>
                                    
                                    <c:if test="${bannerEntity.type == 3 }">
                                        <option value="1">网页</option>
                                        <option value="2">商家</option>
                                        <option value="3" selected="selected">会员认证</option>
                                        <option value="4">仅供查看</option>
                                    </c:if>
                                    
                                    <c:if test="${bannerEntity.type == 4 }">
                                        <option value="1">网页</option>
                                        <option value="2">商家</option>
                                        <option value="3">会员认证</option>
                                        <option value="4" selected="selected">仅供查看</option>
                                    </c:if>
                                  
                                  </select>
                                </div>
                                </div>
                        </div>
                        
                        <div class="row">
                            <div class="col-xs-2 inform_left">
                                                                                                       级别：
                            </div>
                            <div class="col-xs-4 inform_right">
                                <input style="width:150px;"  type="text" name="level" value="${bannerEntity.level }"/>
                            </div>
                        </div>
                        
                        <div class="row">
                                <div class="col-xs-2 inform_left">
                                                                                                    参数：
                                </div>
                                <div class="col-xs-4 inform_right">
                                    <input style="width:320px;" type="text" name="parameter" value="${bannerEntity.parameter }" />
                                </div>
                        </div>
                        <div class="row">
                                <div class="col-xs-2 inform_left">
                                                                                                            图片：
                                </div>
                                    <input type="hidden" name="imgUrl" value="${bannerEntity.imgUrl}" />
                                <div class="col-xs-4 touxiang">
                                    <div id="preview" class="business_settled_info-center-form-right-file-img" style="width:80px; height: 80px; overflow: hidden; padding-top: 5px;">
                                        <img id="imghead" src="http://qiniu.images.69mark.com/${bannerEntity.imgUrl}" style="width:80px; height: 80px; margin-top: 10px;" onclick="$('#previewImg').click();" />
	                                </div>
	                                <div class="business_settled_info-center-form-right-file-input" >
	                                    <input name="file" type="file" onchange="previewImage(this)" id="previewImg">
	                                </div>
                                </div>
                        </div>
                        <div class="row">
                            <div class="col-xs-2 inform_left">
                                                                                                        是否开启：
                            </div>
                            <div class="col-xs-4 inform_right">
                              <c:if test="${bannerEntity.open ==0}">
                              <span>
                                   <input type="radio" name="open" value="0" checked="checked">&nbsp;是
                              </span>
                              <span style="padding-left: 10px;">
                                  <input type="radio" name="open" value="1">&nbsp;否
                              </span>
                            </c:if>
                            
                             <c:if test="${bannerEntity.open ==1}">
                                 <span>
                                      <input type="radio" name="open" value="0" >&nbsp;是
                                 </span>
                                 <span style="padding-left: 10px;">
                                     <input type="radio" name="open" value="1" checked="checked">&nbsp;否
                                 </span>
                             </c:if>
                            </div>
                        </div>
                    </section>
                </section>
                
                <footer class="footer bg-white b-t">
                    <div class="row text-center-xs">
                        <div class="col-md-6 hidden-sm">
                            <button onclick ="javascript:history.go(-1);">上一步</button>
                            <button>保存</button>
                        </div>
                        <div class="col-md-6 col-sm-12 text-right text-center-xs">
                           
                        </div>
                    </div>
                </footer>
            </section>
            </form>
            
            <!--以上为内容-->
            <a href="#" class="hide nav-off-screen-block" data-toggle="class:nav-off-screen" data-target="#nav"></a>
        </section>
             </section>

         </section>
    </section>
    </section>
  </section>
  </section>
  
  
<script type="text/javascript">
    $("#banner").addClass("active");
    $("#nav_6").css('display','block');
  
    $("#b_zhuye").addClass("active2");
    
        //图片上传预览    IE是用了滤镜。
        function previewImage(file)
        {
          var MAXWIDTH  = 90; 
          var MAXHEIGHT = 90;
          var div = document.getElementById('preview');
          if (file.files && file.files[0])
          {
              div.innerHTML ='<img id=imghead onclick=$("#previewImg").click()>';
              var img = document.getElementById('imghead');
              img.onload = function(){
                var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
                img.width  =  rect.width;
                img.height =  rect.height;
//                 img.style.marginLeft = rect.left+'px';
                img.style.marginTop = rect.top+'px';
              }
              var reader = new FileReader();
              reader.onload = function(evt){
                   img.src = evt.target.result;
                   /* $("#imgUrl").val(evt.target.result); */
                }
              reader.readAsDataURL(file.files[0]);
              
          }
          else //兼容IE
          {
            var sFilter='filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale,src="';
            file.select();
            var src = document.selection.createRange().text;
            div.innerHTML = '<img id=imghead>';
            var img = document.getElementById('imghead');
            img.filters.item('DXImageTransform.Microsoft.AlphaImageLoader').src = src;
            var rect = clacImgZoomParam(MAXWIDTH, MAXHEIGHT, img.offsetWidth, img.offsetHeight);
            status =('rect:'+rect.top+','+rect.left+','+rect.width+','+rect.height);
            div.innerHTML = "<div id=divhead style='width:"+rect.width+"px;height:"+rect.height+"px;margin-top:"+rect.top+"px;"+sFilter+src+"\"'></div>";
          }
        }
        function clacImgZoomParam( maxWidth, maxHeight, width, height ){
            var param = {top:0, left:0, width:width, height:height};
            if( width>maxWidth || height>maxHeight ){
                rateWidth = width / maxWidth;
                rateHeight = height / maxHeight;
                
                if( rateWidth > rateHeight ){
                    param.width =  maxWidth;
                    param.height = Math.round(height / rateWidth);
                }else{
                    param.width = Math.round(width / rateHeight);
                    param.height = maxHeight;
                }
            }
            param.left = Math.round((maxWidth - param.width) / 2);
            param.top = Math.round((maxHeight - param.height) / 2);
            return param;
        }
</script>
</body>
</html>